<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <meta name="renderer" content="webkit">
    <meta charset="UTF-8">
    <title>主页</title>
    <!--    <link href="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.css" rel="stylesheet">-->
    <link href="../static/dist/semantic.min.css" th:href="@{/dist/semantic.min.css}" rel="stylesheet">
    <link rel="stylesheet" href="../static/css/layui.css" th:href="@{/css/layui.css}">
    <link href="../static/css/index.css" th:href="@{/css/index.css}" rel="stylesheet">
    <link href="../static/css/public.css" th:href="@{/css/public.css}" rel="stylesheet">
    <link rel="stylesheet" href="../static/css/notiflix.min.css" th:href="@{/css/notiflix.min.css}">
    <style>
        a.search-wo:hover {
            color: #cdff87;
        }


        .remarks {
            overflow: hidden;

            text-overflow: ellipsis;

            white-space: nowrap;
        }

        .row {
            border: rgba(236, 223, 220, 0) 0.5px solid;
            border-radius: 5px;
            margin-top: 10px;
            background-color: rgba(255, 236, 234, 0.25);
            font-size: 16px;

        }

        .row span {
            color: black;
        }

        .row a {
            color: #9f2617;
        }

        .approve-detail {
            width: 95%;
            height: 40px;
        }

        .end {
            pointer-events: none;
        }

        .bulletin-div {
            width: 95%;
            height: 70px;
            overflow: auto;
        }

    </style>
</head>
<body>
<nav class="ui inverted  attached  segment m-padded-tb-mini m-shadow-small">
    <div class="ui inverted secondary stackable menu" style="width: 93.7% !important;">
        <h2 class="ui teal header item" style="margin-left: 5.2%;font: italic 2em Georgia, serif;">Time-varying</h2>
        <a href="javascript:void(0)" class="m-item active item m-mobile-hide" id="index"><i class="edit  icon"> </i>生产计划</a>
        <a href="javascript:void(0)" id="craft" class="m-item item m-mobile-hide craft"><i
                class="magic icon"> </i>工艺</a>
        <a href="javascript:void(0)" id="admin" class="m-item item m-mobile-hide admin"><i
                class="object ungroup outline icon"> </i>管理员</a>
        <a href="javascript:void(0)" id="hours" class="m-item item m-mobile-hide admin"><i
                class="street view icon"> </i>工时管理</a>
        <a href="javascript:void(0)" id="watch-ticket" class="item m-item m-mobile-hide"><i
                class="pound sign icon"> </i>查看工单</a>
        <a href="javascript:void(0)" id="add-ticket" class="item item m-item m-mobile-hide"><i
                class="leaf icon"> </i>添加工单</a>
        <div class="right m-item m-mobile-hide menu">
            <div class="ui dropdown item">
                <div class="text">
                    <img class="ui avatar image" src="../static/image/test.jpg" th:src="@{/image/test.jpg}">
                    Hi~ <span id="real-name"></span>
                </div>
                <i class="dropdown icon"></i>
                <div class="menu">
                    <a href="#" th:href="@{/logout}" class="item">注销</a>
                    <a href="javascript:void(0)" class="item" id="update-password">修改密码</a>
                    <a href="javascript:void(0)" class="item" id="bindEmail">邮箱绑定</a>
                </div>
            </div>
        </div>
    </div>
</nav>
<div class="m-padded-tb-big">
    <div class="ui container" style="float: left;width: 5%;">
        <div class="ui vertical menu m-container-mini" style="font-size: 1.2em;">
            <div class="item">
                <div class="ui teal header">计划</div>
                <div class="menu">
                    <a class="item left-item add-work" data-tooltip="添加新的工单" data-position="right center">添加工单</a>
                    <a class="item left-item show-work" data-tooltip="查看所有工单" data-position="right center">查看工单</a>
                </div>
            </div>
            <div class="item">
                <div class="header">Support</div>
                <div class="menu">
                    <a class="item left-item view-approve" data-tooltip="查看审批"
                       data-position="right center">我的审批</a>
                </div>
            </div>
        </div>
    </div>
</div>
<input type="hidden" th:value="${message}" id="message">
<div class="m-padded-lr bj-wk">
    <div class="ui container m-container"
         style="width: 88%!important;float: right !important; margin-right: 1em !important;">
        <div class="ui top attached" id="front-page" style="display: none">
            <div class="ui equal width grid">
                <div class="column" style="float: right;margin-left: 1.5vw;">
                    <div class='ui fluid image'>
                        <div class='ui teal  ribbon label'><i class='accusoft icon'></i><font
                                style='vertical-align: inherit;'><font
                                style='vertical-align: inherit;'>工单信息</font></font>
                        </div>
                    </div>
                    <div id="main" style="width: 25vw;height:28vw;">

                    </div>
                </div>
                <div class="column" style="float: right;margin-left: 1.5vw;">
                    <div class='ui fluid image' style="position: absolute;margin-top: -43px;">
                        <div class='ui orange  ribbon label'><i class='accusoft icon'></i><font
                                style='vertical-align: inherit;'><font
                                style='vertical-align: inherit;'>任务待办</font></font>
                        </div>
                    </div>
                    <div style="width: 25vw;height:28vw;overflow:auto;margin-top: 15px;"
                         id="task">

                    </div>
                </div>
                <div class="column" style="float: right;margin-left: 1.5vw;">
                    <div class='ui fluid image' style="position: absolute;margin-top: -43px;">
                        <div class='ui red ribbon label'><i class='accusoft icon'></i><font
                                style='vertical-align: inherit;'><font
                                style='vertical-align: inherit;'>审批信息</font></font>
                        </div>
                    </div>
                    <div style="width: 25vw;height:28vw;overflow:auto;margin-top: 15px;"
                         id="approve-info">

                    </div>
                </div>
                <div class="equal width row" style="background-color: white">
                    <div class="column" style="width: 55%;">
                        <div class='ui fluid image' style="position: absolute;margin-top: -43px;">
                            <div class='ui black ribbon label'><i class='accusoft icon'></i><font
                                    style='vertical-align: inherit;'><font style='vertical-align: inherit;'>生产信息</font></font>
                            </div>
                        </div>
                        <div class="ui  horizontal link list">
                            <div class="item">
                                <label>年</label>
                                <div class="ui search selection dropdown">
                                    <input name="year" id="year" type="hidden">
                                    <div class="default text default-year"></div>
                                    <i class="dropdown icon"></i>
                                    <div class="menu" id="default-year-menu">

                                    </div>
                                </div>
                            </div>
                            <div class="item">
                                <label>月</label>
                                <div class="ui search selection dropdown">
                                    <input name="month" id="month" type="hidden">
                                    <div class="default text default-month"></div>
                                    <i class="dropdown icon"></i>
                                    <div class="menu" id="default-month-menu">

                                    </div>
                                </div>
                            </div>
                            <div class="item">
                                <label>日</label>
                                <div class="ui search selection dropdown">
                                    <input name="day" id="day" type="hidden">
                                    <div class="default text default-day"></div>
                                    <i class="dropdown icon"></i>
                                    <div class="menu" id="default-day-menu">

                                    </div>
                                </div>
                            </div>
                            <div class="item">
                                <label>产品编码</label>
                                <div class="ui search selection dropdown">
                                    <input name="productC" id="productC" type="hidden">
                                    <div class="default text default-productC"></div>
                                    <i class="dropdown icon"></i>
                                    <div class="menu" id="default-productC-menu">

                                    </div>
                                </div>
                            </div>
                            <div class="item">
                                <button class="ui olive button" id="export-year">导出年报</button>
                            </div>
                            <div class="item">
                                <button class="ui primary button" id="export-month">导出月报</button>
                            </div>
                            <div class="item">
                                <button class="ui positive button" id="export-day">导出日报</button>
                            </div>
                        </div>
                        <div id="main2">

                        </div>
                    </div>
                    <div class="column" style="margin-left: 11%;width: 30%;">
                        <div class='ui fluid image' style="position: absolute;margin-top: -43px;">
                            <div class='ui violet ribbon label'><i class='affiliatetheme  icon'></i><font
                                    style='vertical-align: inherit;'><font
                                    style='vertical-align: inherit;'>公示栏</font></font>
                            </div>
                        </div>
                        <div style="overflow:auto;height: 600px;" id="bulletin">

                        </div>
                    </div>
                </div>
            </div>

            <!--<div style="width: 400px;height: 400px;float:right;">-->
            <!--<div class='ui fluid image' style="position: absolute;margin-top: -43px;">-->
            <!--<div class='ui red ribbon label'><i class='accusoft icon'></i><font-->
            <!--style='vertical-align: inherit;'><font style='vertical-align: inherit;'>审批信息</font></font>-->
            <!--</div>-->
            <!--</div>-->
            <!--<div style="width: 100%;height: 95%;overflow:auto;margin-top: 15px;"-->
            <!--id="approve-info">-->

            <!--</div>-->
            <!--</div>-->
            <!--<div style="float: right;width: 500px;height: 400px;margin-right: 80px;">-->
            <!--<div class='ui fluid image' style="position: absolute;margin-top: -43px;">-->
            <!--<div class='ui orange  ribbon label'><i class='accusoft icon'></i><font-->
            <!--style='vertical-align: inherit;'><font style='vertical-align: inherit;'>任务待办</font></font>-->
            <!--</div>-->
            <!--</div>-->
            <!--<div style="width: 100%;height: 95%;overflow:auto;margin-top: 15px;"-->
            <!--id="task">-->

            <!--</div>-->
            <!--</div>-->
            <!--<div style="float: right;width: 500px;height:400px;margin-right: 100px;">-->
            <!--<div class='ui fluid image'>-->
            <!--<div class='ui teal  ribbon label'><i class='accusoft icon'></i><font-->
            <!--style='vertical-align: inherit;'><font style='vertical-align: inherit;'>工单信息</font></font>-->
            <!--</div>-->
            <!--</div>-->
            <!--<div id="main" style="width: 500px;height:400px;">-->

            <!--</div>-->
            <!--</div>-->

            <!--<div style="float: left;width: 1000px;height:550px;margin-left:60px;margin-top: 100px;">-->
            <!---->
            <!--</div>-->

            <!--<div style="float: left;width: 500px;height:600px;margin-top: 100px;margin-left: 120px;">-->
            <!--<div class='ui fluid image' style="position: absolute;margin-top: -43px;">-->
            <!--<div class='ui violet ribbon label'><i class='affiliatetheme  icon'></i><font-->
            <!--style='vertical-align: inherit;'><font style='vertical-align: inherit;'>公示栏</font></font>-->
            <!--</div>-->
            <!--</div>-->
            <!--<div style="overflow:auto;width:100%;height:100%;" id="bulletin">-->

            <!--</div>-->
            <!--</div>-->
        </div>
        <div class="ui top attached hide" id="all-work">
            <div class="ui top attached">
                <div class="ui  horizontal link list">
                    <div class="item">
<!--                        <div class="ui search">-->
<!--                            <div class="ui left icon input">-->
<!--                                <input class="prompt" type="text" id="search-text" placeholder="Search Work order"-->
<!--                                       style="width: calc(20 * 14px)">-->
<!--                                <i class="search icon"></i>-->
<!--                                <div class="ui positive button search-work">Go</div>-->
<!--                            </div>-->
<!--                        </div>-->
                        <div class="ui search">
                            <div class="ui left icon input">
                                <input class="prompt" type="text" placeholder="Search GitHub">
                                <i class="github icon"></i>
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <button class="ui primary button checkModify">
                            批量修改
                        </button>
                    </div>
                    <div class="item">
                        <button class="ui positive button cancelCheck disabled">
                            取消
                        </button>
                    </div>

                    <div class="item">
                        <button class="ui positive button sureCheck disabled">
                            确定
                        </button>
                    </div>

                    <div class="item">
                        <div class="ui calendar">
                            <div class="ui input left icon">
                                <i class="calendar alternate outline icon"></i>
                                <input type="text" placeholder="查询历史记录" id="historicalTime" name="historicalTime">
                            </div>
                        </div>
                    </div>
                    <div class="item">
                        <div class="ui selection dropdown">
                            <input name="work-order-status" id="work-order-status" type="hidden">
                            <div class="default text" id="status-text">请选择工单状态</div>
                            <i class="dropdown icon"></i>
                            <div class="menu">
                                <div class="item" data-value="下达">
                                    下达
                                </div>
                                <div class="item" data-value="在制">
                                    在制
                                </div>
                                <div class="item" data-value="完工">
                                    完工
                                </div>
                                <div class="item" data-value="结案">
                                    结案
                                </div>
                                <div class="item" data-value="异常">
                                    异常
                                </div>
                                <div class="item" data-value="重大异常">
                                    重大异常
                                </div>
                            </div>
                        </div>
                    </div>

                    <div class="item">
                        <a id='reload-work-order' style="color: #0C0C0C"><i class='sync alternate icon'></i>刷新</a>
                    </div>
                </div>
                <div class="item" style="float: right">
                    <span id="total"></span>
                </div>
            </div>
            <div class="ui attached">
                <table class="ui striped  celled table">
                    <thead>
                    <tr style="text-align: center">
                        <th><a href="javascript:void(0)" id="select_all" class="hide">全选</a></th>
                        <th>序号</th>
                        <th>工单号</th>
                        <th>订单号</th>
                        <th>产品编码</th>
                        <th>产品型号</th>
                        <th>生产数量</th>
                        <th>计划开工时间</th>
                        <th>计划完工时间</th>
                        <th>实际完工时间</th>
                        <th>软件版本</th>
                        <th>备注&特殊要求</th>
                        <th>状态</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>
                    </tbody>
                    <tfoot>
                    </tfoot>
                </table>
            </div>
        </div>
        <div class="ui top attached" style="display: none" id="my-approve">
            <div class="ui attached" style="margin: 0 auto;width: 700px;" id="half-res">
                <table class="ui striped celled table" id="approve-table">
                    <thead>
                    <tr>
                        <th>工单号</th>
                        <th>审批结果</th>
                        <th>审批人</th>
                        <th>操作</th>
                    </tr>
                    </thead>
                    <tbody>

                    </tbody>
                    <tfoot>

                    </tfoot>
                </table>
            </div>
        </div>
        <input type="hidden" id="taskId">
        <input type="hidden" id="workOrderNumber">
        <div class="ui modal update-password">
            <div class="header">修改密码</div>
            <i class="close icon"></i>
            <form id="update-password-form" class="ui form segment" onsubmit="return false" autocomplete="off">
                <div class="field">
                    <label>请输入新密码</label>
                    <input type="password" name="password" id="new-password" placeholder="请输入新密码 格式: 数字&小写英文 长度:6-13">
                </div>
                <div class="field">
                    <label>确认密码</label>
                    <input type="password" name="password" id="sure-password" placeholder="确认再次输入密码">
                </div>
                <div class="ui rest-password reset button">重置</div>
                <div style="float: right;">
                    <div class="ui positive submit button" id="updatePassword-btn">确认</div>
                </div>
            </form>
        </div>

        <div class="ui modal bindEmailModal">
            <div class="header">邮箱绑定</div>
            <i class="close icon"></i>
            <form id="emailFrom" class="ui form segment" onsubmit="return false" autocomplete="off">
                <div class="field">
                    <label>请输入邮箱</label>
                    <input type="text" name="email" id="email" placeholder="请输入邮箱">
                </div>
                <div class="ui reset button">重置</div>
                <div style="float: right;">
                    <div class="ui positive submit button">提交</div>
                </div>
            </form>
        </div>

        <div class="ui modal details-modal">
            <div class="header">审批详情</div>
            <i class="close icon"></i>
            <div class="ui form segment">
                <div class="field">
                    <label>发起人</label>
                    <div class="ui segment approve-detail">
                        <span id="sponsor"></span>
                    </div>
                </div>
                <div class="field">
                    <label>发起时间</label>
                    <div class="ui segment approve-detail">
                        <span id="start-time"></span>
                    </div>
                </div>
                <div class="field">
                    <label>审批人</label>
                    <div class="ui segment approve-detail">
                        <span id="approver"></span>
                    </div>
                </div>
                <div class="field">
                    <label>审批状态</label>
                    <div class="ui segment approve-detail">
                        <span id="approval-status"></span>
                    </div>
                </div>
                <div class="field">
                    <label>结果详情</label>
                    <div class="ui segment approve-detail" style="overflow:auto;height: 100px;">
                        <span id="result-details"></span>
                    </div>
                </div>
            </div>
        </div>
        <div class="ui modal reject-modal">
            <div class="header">驳回原因</div>
            <i class="close icon"></i>
            <form class="ui form segment" id="reject-form" onsubmit="return false" autocomplete="off">
                <div class="field">
                    <label>
                        <textarea cols="20" rows="5" placeholder="请填写驳回原因" id="reason"></textarea>
                    </label>
                </div>
                <div class="ui reason reset button">重置</div>
                <div style="float: right;">
                    <div class="ui positive submit button" id="reason-btn">确认</div>
                </div>
            </form>
        </div>
        <!--工单添加modal-->
        <div class="ui modal work">
            <div class="header">添加新工单</div>
            <i class="close icon"></i>
            <form class="ui form segment" id="work-form" onsubmit="return false" autocomplete="off">
                <div class="two fields">
                    <div class="field">
                        <label>工单类型</label>
                        <div class="ui search selection dropdown">
                            <input name="workType" id="workType" type="hidden">
                            <div class="default text" data-value="P">成品工单</div>
                            <i class="dropdown icon"></i>
                            <div class="menu">
                                <div class="item" data-value="B">半成品工单(B)</div>
                                <div class="item" data-value="P">成品工单(P)</div>
                                <div class="item" data-value="F">返修工单(F)</div>
                            </div>
                        </div>
                    </div>
                    <div class="field">
                        <label>产品编码</label>
                        <input type="text" name="productCode" id="productCode" placeholder="产品编码">
                    </div>

                </div>
                <!--                <div class="field">-->
                <!--                    <label>订单号</label>-->
                <!--                    <input type="text" name="orderNumber" id="orderNumber" placeholder="订单号">-->
                <!--                </div>-->
                <div class="two fields">
                    <div class="field">
                        <label>订单号</label>
                        <input type="text" name="orderNumber" id="orderNumber" placeholder="订单号">
                    </div>
                    <div class="field">
                        <label>软件版本</label>
                        <input type="text" name="softwareVersion" id="softwareVersion" placeholder="格式支持(数字,点,大小写字母,横线,下划线)">
                    </div>
                </div>

                <div class="two fields">
                    <div class="field">
                        <label>产品型号</label>
                        <input type="text" name="productNumber" id="productNumber" placeholder="产品型号">
                    </div>
                    <div class="field">
                        <label>生产数量</label>
                        <input type="text" name="productionQuantity" id="productionQuantity" placeholder="生产数量">
                    </div>
                </div>
                <div class="two fields" id="times">
                    <div class="field">
                        <label>计划开始时间</label>
                        <div class="ui calendar">
                            <div class="ui input left icon">
                                <i class="calendar alternate outline icon"></i>
                                <input type="text" placeholder="计划开始时间" id="planBeginTime" name="planBeginTime">
                            </div>
                        </div>
                    </div>
                    <div class="field">
                        <label>计划结束时间</label>
                        <div class="ui calendar">
                            <div class="ui input left icon">
                                <i class="calendar alternate outline icon"></i>
                                <input type="text" placeholder="计划结束时间" id="planEndTime" name="planEndTime">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="field">
                    <label>备注&特殊要求</label>
                    <input type="text" name="remarks" id="remarks" placeholder="备注">
                </div>
                <div class="ui work reset button">重置</div>
                <div style="float: right;">
                    <div class="ui positive submit button" id="addWork-btn">提交</div>
                </div>
            </form>
        </div>
        <div class="ui modal approval-sign-modal">
            <i class="close icon"></i>
            <table class="ui striped celled table" id="sign-table">
                <thead>
                <tr>
                    <th>发起人</th>
                    <th>生产负责人签字</th>
                    <th>质检负责人签字</th>
                    <th>工艺负责人签字</th>
                    <th>质量负责人签字</th>
                    <th>计划负责人签字</th>
                    <th>发起时间</th>
                </tr>
                </thead>
                <tbody>

                </tbody>
            </table>
        </div>
    </div>
</div>
<!--<script src="https://cdn.jsdelivr.net/npm/jquery@3.2/dist/jquery.min.js"></script>-->
<script src="../static/js/jquery.min.js" th:src="@{/js/jquery.min.js}"></script>
<!--<script src="https://cdn.jsdelivr.net/npm/semantic-ui@2.4.2/dist/semantic.min.js"></script>-->
<script src="../static/dist/semantic.min.js" th:src="@{/dist/semantic.min.js}"></script>
<script src="../static/js/init.js" th:src="@{/js/init.js}"></script>
<script src="../static/js/laydate.min.js" th:src="@{/js/laydate.min.js}"></script>
<script src="../static/js/layui.js" th:src="@{/js/layui.js}"></script>
<script src="../static/js/echarts.min.js" th:src="@{/js/echarts.min.js}"></script>
<script src="../static/js/notiflix.min.js" th:src="@{/js/notiflix.min.js}"></script>
<script src="../static/js/notiflix-aio.min.js" th:src="@{/js/notiflix-aio.min.js}"></script>
<script src="../static/js/public.js" th:src="@{/js/public.js}"></script>
<script src="../static/js/jquery.fileDownload.min.js" th:src="@{/js/jquery.fileDownload.min.js}"></script>
<script src="../static/js/main.js" th:src="@{/js/main.js}"></script>
</body>
</html>